<template>
  <div class="box">
    <header class="top">
      <van-nav-bar title="订单确认" left-arrow @click-left="$router.back()" />
    </header>
    <div class="address">
      <van-address-list v-model="chosenAddressId" :list="list" default-tag-text="默认" :show-add-button="false" />
    </div>
    <div class="food-info"></div>
    <div class="pay">
      <van-submit-bar :price="3050" button-text="提交订单" @submit="onSubmit" />
    </div>
  </div>
</template>

<script>
import { getReceiveAddressAPI } from "@/api/user";
export default {
  data() {
    return {
      list: [
        {
          id: "1",
          name: "张三",
          tel: "13000000000",
          address: "浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室",
          isDefault: true,
        },
      ],
      loginUser: {},
    };
  },
  methods: {
    onSubmit() { },
    // 加载当前下单的用户的收货地址数据
    loadReceiveAddress() {
      getReceiveAddressAPI({ userId: this.loginUser.userId }).then((resp) => {
        if (resp.data.code == 20000) {
          // 处理数据
          this.list = resp.data.datas.map((item) => {
            return {
              id: item.daId,
              name: item.contactName,
              tel: item.contactTel,
              address: item.address,
              isDefault: true,
            };
          });
        }
      });
    },
  },
  created() {
    let loginUser = localStorage.getItem("loginUser");
    if (!loginUser) {
      this.$router.push("/login");
      return;
    }
    this.loginUser = JSON.parse(loginUser);
    this.loadReceiveAddress();
  },
};
</script>

<style lang="less" scoped>
.box {
  width: 100%;
  height: 100%;

  .top {
    height: 60px;
  }
}
</style>
